import React from "react";
import { useEffect } from "react";
import { useLocation } from "react-router-dom";
import "./index.css";
import axios from "axios";
import { useState } from "react";

export default function HeroDetail() {
  
  return (
    <div className="container hero-detail">
      <div className="col-xs-3 base-info">
        <h3>{hero.name}</h3>
        <p>{hero.type}</p>

        <div className="row">
          <div className="col-xs-3">
            <img
              width="100%"
              src="http://cdn.xiaohigh.com/images/heros/skills/53800.png"
              alt=""
              className="img-responsive"
            />
            <h6>狩猎</h6>
          </div>
          <div className="col-xs-3">
            <img
              width="100%"
              src="http://cdn.xiaohigh.com/images/heros/skills/53800.png"
              alt=""
              className="img-responsive"
            />
            <h6>狩猎</h6>
          </div>
          <div className="col-xs-3">
            <img
              width="100%"
              src="http://cdn.xiaohigh.com/images/heros/skills/53800.png"
              alt=""
              className="img-responsive"
            />
            <h6>狩猎</h6>
          </div>
          <div className="col-xs-3">
            <img
              width="100%"
              src="http://cdn.xiaohigh.com/images/heros/skills/53800.png"
              alt=""
              className="img-responsive"
            />
            <h6>狩猎</h6>
          </div>
        </div>
      </div>

      <div className="col-xs-9">
        <img
          className="img-responsive"
          src={"http://cdn.xiaohigh.com/images/heros/538-bigskin-1.jpg"}
          alt=""
        />
        <hr />
        <p>
        出生名门的少女云缨，自小听着李娘子的故事长大，憧憬着长安元勋们的传奇人生。
        为了成为和李娘子一样了不起的英雄，她孜孜不倦的钻研掠火枪，成为街坊邻里眼中“不务正业”的名门千金
        </p>
      </div>
    </div>
  );
}
